@import '../c_themes/theme.scss';
// 底栏
.footBar{
	width: 100%;
	position: fixed;
	bottom: 0;
	z-index: 9;
}
// 菜单底栏
.footBar.foot-menu-content {
	background-color: $weak-color;
	border-top-left-radius: $common-border-radius;
	border-top-right-radius: $common-border-radius;
	box-shadow: 0 0 40rpx $normal-box-shadow-color;
}
// 通用底栏
.footBar.foot-common-content {
	background-color: $weakest-color;
	border-top: $common-line-width solid $tweenLine-color;
}

// 菜单中按钮的布局
	.full-btn {
		margin: 20rpx 0;
	}
	// 按钮组布局 竖排 |横排
	.buttons-content-row,
	.buttons-content-columns {
		padding: 10rpx 20rpx;
	}
		// 竖排排列
		.buttons-content-columns {
			display: flex;
			justify-content: space-between;
			align-items: center;
		}
		// 竖排按钮
		.buttons-content-columns .full-btn {
			font-size: $normal-fontSize;
			line-height: 100%;
			flex: 1;
			margin-right: 20rpx;
		}
			//	并列最后一个项目
			.buttons-content-columns .full-btn:last-child {
				margin: 0;
			}
		// 底栏信息
		.buttons-content-columns .footBar-info-item {
			width: 40%;
			padding: 20rpx 0;
		}

	// 分享菜单
	.share-content{
		padding: 10rpx 20rpx;
	}
		// 按钮容器
		.share-content .wrap-share-btns{
			display: flex;
			justify-content: space-around;
		}
	// 评论
	.comment-content{
		padding: 0;
	}
		// 输入容器
		.comment-content .wrap-input{
			padding: 30rpx 30rpx 20rpx 30rpx;
		}
		.comment-content .send-bar{
			background-color: $weakest-color;
			border-top: $common-line-width solid $tweenLine-color;
		}

	// 底栏分栏导航
	.bottom-menu-nav {
		padding: 30rpx;
		display: flex;
		justify-content: space-around;
	}
		// 分栏按钮
		.bottom-menu-nav button {
			font-size: $title3-fontSize;
			color: $sub-color;
			font-weight: bold;
			padding: 10rpx 20rpx;
			border-bottom:none;
			display: block;
			background-color: transparent !important;
			border-radius: 0;
			line-height: 1;
		}
		.bottom-menu-nav button::after {
			display: none;
		}
		// 按钮选中
		.bottom-menu-nav  button.tab-btn-selected{
			color: $normal-color;
			border-bottom: $sort-button-line-width solid $important-color;
		}
	// 底栏组件
	.component-content {
		padding: 0rpx 30rpx 40rpx;
		text-align: center;
	}
		// 组件数值
		.component-content .component-title-score {
			font-size: $title1-fontSize;
			color: $sub-color;
			line-height: 2;
		}
		// 组件数值
		.component-content .component-share {
			padding: 10rpx;
		}

	// 评论条
	.commentBar {
		display: flex;
		justify-content: center;
		align-items: center;
		align-content: center;
		padding: 20rpx;
	}
	// 底栏按钮
	.commentBar .commentBar-btn {
		text-align: center;
		padding: 0 5rpx;
		margin: 0 5rpx;
		color: $sub-color;
	}
	// 按钮图标
	.commentBar .commentBar-btn .fontIcon {
		padding: 0;
		margin: 0;
		height: 55rpx;
		display: block;
		color: $sub-color;
	}
	// 选中的后的按钮的文字和图标
	.commentBar .btn-selected,
	.commentBar .btn-selected .fontIcon {
			color: $important-color;
		}
	// 输入框
	.commentBar .footBar-input {
		border: $common-line-width solid $sub-light-color;
		font-size: $normal-fontSize;
		flex: 1;
		padding: 10rpx;
		border-radius: $larger-border-radius;
		margin: 0 10rpx;
	}

// 通用输入顶栏
.common-customize-input-topBar,
.comment-content .send-bar {
	padding: 20rpx;
	display: flex;
	justify-content: space-around;
	align-items: center;
	bottom: 0;
	width: calc(100% - 40rpx);
}
		// 输入统计
		.common-customize-input-topBar .input-count,
		.comment-content .send-bar .input-count{
			flex: 1;
			text-align: center;
		}
		// 字体图标
		.common-customize-input-topBar .fontIcon ,
		.comment-content .send-bar .fontIcon {
			color: $sub-color;
		}
		// 发送图标
		.common-customize-input-topBar .icon-sent ,
		.comment-content .send-bar .icon-sent {
			color: $important-color;
		}